<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"   
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:body>
        <p:panelGrid styleClass="organisationGrid" columns="2">
            <p:panel id="displayArticles" header="Articles list">
                <h:form id="selectArticleStateForm">
                    <p:selectOneRadio value="#{myAuction.selectedState}">
                        <f:selectItem itemLabel="All" itemValue="All"/>
                        <f:selectItems value="#{myArticleBean.articleState}" />
                        <p:ajax event="change" update=":dataArticle" />
                    </p:selectOneRadio>
                </h:form>
                <p:dataTable id="dataArticle" var="article" value="#{myAuction.listAuction}"
                             styleClass="standardDataTable">
                    <p:column headerText="Name">
                        <h:outputText value="#{article.name}"/>
                    </p:column>
                    <p:column headerText="Auction's End">
                        <h:outputText value="#{article.endSale}">
                            <f:convertDateTime pattern="dd/MM/yyyy HH:mm" />
                        </h:outputText>
                    </p:column>
                    <p:column headerText="Last Auction">
                        <h:outputText value="#{article.actualPrice}">
                            <f:convertNumber type="currency" currencySymbol="€" />
                        </h:outputText>
                    </p:column>
                    <p:column headerText="Status">
                        <h:outputText rendered="#{article.winningBid.bidder.id == headerBean.loggedUser.id}" value="Leading" style="color: green" />
                        <h:outputText rendered="#{article.winningBid.bidder.id != headerBean.loggedUser.id}" value="Better bid" style="color: red" />
                    </p:column>
                    <p:column headerText="Details"> 
                        <h:form id="viewDetailsForm">
                            <p:commandLink id="selectButton" update=":displayArticle">  
                                <img src="resources/images/ic_show.png" />
                                <f:setPropertyActionListener value="#{article}" target="#{myAuction.selectedArticle}" />
                                <p:ajax event="click" />
                            </p:commandLink>
                        </h:form>
                    </p:column>
                </p:dataTable>                   
            </p:panel>

            <p:panel id="displayArticle" header="Details" >
                <h:form>
                    <p:panelGrid styleClass="organisationGrid" columns="2">
                        <h:outputText value="Name" styleClass="outputTextLabel"/>
                        <h:outputText value="#{myAuction.selectedArticle.name}" styleClass="outputTextValue" />
                        <h:outputText value="Status" styleClass="outputTextLabel" />
                        <h:outputText value="#{myAuction.selectedArticle.articleState}" styleClass="outputTextValue"/>
                        <h:outputText value="Description" styleClass="outputTextLabel" />
                        <h:outputText value="#{myAuction.selectedArticle.description}" styleClass="outputTextValue"  />
                        <h:outputText value="ActualPrice" styleClass="outputTextLabel"/>
                        <h:outputText value="#{myAuction.selectedArticle.actualPrice}" styleClass="outputTextValue">
                            <f:convertNumber type="currency" />
                        </h:outputText>
                        <h:outputText value="Categories" styleClass="outputTextLabel" />
                        <p:dataList value="#{myAuction.selectedArticle.categories}" var="cat" rendered="#{!empty(myAuction.selectedArticle)}" >
                            <h:outputText value="#{cat}" styleClass="outputTextValue" style="margin-right: 10px"/>
                        </p:dataList>
                    </p:panelGrid>
                </h:form>
            </p:panel>
        </p:panelGrid>
    </h:body>
</html>